<!--
 * @Author: zqx me_zqx@163.com
 * @Date: 2025-02-20 15:01:32
 * @LastEditors: zqx me_zqx@163.com
 * @LastEditTime: 2025-03-04 14:49:00
 * @FilePath: /XMate-h5/src/views/myXmate/myTeam/index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="flex flex-col h-screen bg-[#F5F5F5]">
    <van-tabs v-model:active="active" @change="onActiveChanged">
      <van-tab v-for="item in cp_tabs" :key="item.value" :title="item.title" />
    </van-tabs>

    <div class="flex-auto overflow-auto">
      <teamNoticeBoard v-if="cp_activeTab === TabType.noticeBoard" />
      <teamCustomer v-if="cp_activeTab === TabType.customer" />
      <teamVisit v-if="cp_activeTab === TabType.visit" />
      <teamReport v-if="cp_activeTab === TabType.report" />
      <teamBusinessOpport v-if="cp_activeTab === TabType.businessOpport" />
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted, computed } from "vue";
import teamCustomer from "./teamCustomer/index.vue";
import teamNoticeBoard from "./teamNoticeBoard/index.vue";
import teamReport from "./teamReport/index.vue";
import teamVisit from "./teamVisit/index.vue";
import teamBusinessOpport from "./teamBusinessOpport/index.vue";
import { useCommonStore } from "@/store";

const active = ref(0);
const commonStore = useCommonStore();

onMounted(() => {
  commonStore.searchCustomerTypeAction();
});

enum TabType {
  noticeBoard = "noticeBoard",
  customer = "customer",
  businessOpport = "businessOpport",
  visit = "visit",
  report = "report",
}

const cp_enableBusinessOpportunity = computed(() => {
  return commonStore.enableBusinessOpportunity;
});

const cp_tabs = computed(() => {
  let array = [];
  array.push({
    title: "团队看板",
    type: TabType.noticeBoard,
  });

  array.push({
    title: "团队客户",
    type: TabType.customer,
  });

  if (cp_enableBusinessOpportunity.value) {
    array.push({
      title: "团队商机",
      type: TabType.businessOpport,
    });
  }

  array.push({
    title: "团队沟通",
    type: TabType.visit,
  });

  array.push({
    title: "团队报告",
    type: TabType.report,
  });

  return array;
});

const cp_activeTab = computed(() => {
  return cp_tabs.value[active.value].type;
});

const onActiveChanged = (index) => {
  console.log("当前选中标签的索引：", index);
};
</script>

<style lang="less" scoped></style>
